<template>
  <div class="ucenter">
      <div class="top">
        <div class="topic">

        </div>
        <div class="nickname">
          <div v-if="email!==''">
            {{email}}
          </div>
          <div v-else>
            <router-link to="/reg">注册</router-link>
          </div>
        </div>
        <div class="info">
          <div class="infoBlock">收入总计：111</div>
          <div class="infoBlock">支出总计：222</div>
        </div>
      </div>
      <div class="main">
        <div class="mainRows">
          <div class="rowTitle cubeic-safe-pay">
            <router-link to='/moneyrecord'>记录明细</router-link>
          </div>
          <div class="rowRight cubeic-arrow"></div>
        </div>
        <div class="mainRows">
          <div class="rowTitle cubeic-tag">
            <router-link to='/typeset'>类别设置</router-link>
          </div>
          <div class="rowRight cubeic-arrow"></div>
        </div>
      </div>
    </div>
</template>
<script>
// import store from '@/store'
export default {
  data () {
    return {
      email: '',
      userinfo: ''
    }
  },
  created () {
    console.log(this.$store.state.userinfo)
    this.userinfo = this.$store.state.userinfo
    this.email = this.userinfo.email
    console.log(this.email, this.userinfo)
  }
}
</script>
<style lang="stylus" scoped>
.ucenter
  width 100%;
  margin 0 auto;
  .top
    padding-top 30px
    width 100%;
    height 130px;
    background rgb(255,228,214)
    .topic
      width 50px;
      height 50px;
      background rgb(249,124,66)
      border-radius 50%;
      margin 0 auto;
    .nickname
      width 100%;
      height 50px;
      line-height 50px;
      text-align center;
      font-size 16px;
      color rgb(249,124,66)
    .info
      width 100%;
      height 30px
      display flex
      .infoBlock
        flex 1
        display flex
        justify-content center
        align-items center
        color #444
        font-size 14px
  .main
    width 100%;
    margin 0 auto;
    background #EEEEEE;
    position fixed
    top 130px
    bottom 50px
    .mainRows
      width 100%;
      height 40px;
      line-height 40px;
      background #fff;
      margin-top 5px;
      display flex
      justify-content space-between
      color #999
      padding-left 10px
      padding-right 10px
      box-sizing border-box
      font-size 14px
      .rowTitle
        padding-left 10px;
</style>
